﻿* { padding:0; margin:0; }
body { text-align:center; font-size:62.5%; background:url(../img/body-bg.gif) repeat; filter:alpha(opacity=20); }
.warp { width:100%; font-size:1.4em; }
.warp>div {
	width:100%;
	height:3.3em;
	padding-top:.3em;
	background:rgba(51,51,51,.8);
	border-bottom:1px solid rgba(204,204,204,.4);
}
#logo {
	width:8.8em;
	height:3.1em;
	float:left;
	margin-left:2em;
	background:rgba(204,204,204,.4);
}
#logo>img{
    padding: 0;
    border: 0;
    width:100%;
    height:100%;
}
.func {
	width:12em;
	height:2.2em;
	margin-top:.4em;
	float:right;
	margin-right:2em;
}
#login-btn {
	width:50%;
	float:left;
	height:100%;
	line-height:2.4em;
	text-align:center;
	color:rgba(255,255,255,.5);
	transition: color 0.3s ease-out;
	background:rgba(204,204,204,.2);
}
#login-btn:hover {
	color:rgba(255,255,255,.9);
	transition: color 0.3s ease-in;
}

#setting-btn {
	width:50%;
	float:left;
	height:100%;
	line-height:2.4em;
	text-align:center;
	color:rgba(255,255,255,.8);
	transition: color 0.3s ease-out;
	background:rgba(19,200,186,.7);
}

.login {  
    top:50%;
	left:50%;
	width:420px;
	height:300px;
	display:none;
	position:fixed;
	padding-left:50px;
	border-radius: 4px;
	margin:-170px 0 0 -225px;
	background:rgba(255,255,255,.7);
	box-shadow:0px 0px 12px #CCCCCC;
    -moz-box-shadow:0px 0px 12px #CCCCCC;
    -webkit-box-shadow:0px 0px 12px #CCCCCC;
	/*direction 阴影角度 0°为从下往上 顺时针方向 strength 阴影段长度*/
    -ms-filter:"progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=0, strength=7)\
                progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=90, strength=7)\
                progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=180, strength=7)\
                progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=270, strength=7)";
    *filter:progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=0, strength=7)
            progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=90, strength=7)
            progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=180, strength=7)
            progid:DXImageTransform.Microsoft.Shadow(color=#E9E9E9, direction=270, strength=7);
}
#close-login {
	width:100%;
	height:2em;
	float:right;
	padding-top:.3em;
	padding-right:1em;
	line-height:2em;
	overflow:hidden;
	font-size:1.8em;
	text-align:right;
	font-weight:bold;
	color:rgba(102,102,102,.9);
	transition: color 0.4s ease-out;
}
#close-login:hover {
	color:rgba(255,0,51,1);
	transition: color 0.4s ease-in;
}
#title {
	float:left;
	margin-bottom:2em;
}
#title #ch-text {
	font-size:2.4em;
	font-weight:bold;
	color:rgba(255,102,51,1);
}
#title #en-text {
	color:rgba(102,102,102,.8);
}
label {
	text-align:left;
	font-size:1.8em;
	color:rgba(102,102,102,.9);
}
input[type='text'],input[type='password'] {
	width:21em;
	float:left;
	height:1.9em;
	padding-left:.5em;
	border-radius:.2em;
	border:.1em solid rgba(0,0,0,.5);
	outline-color:rgba(0,153,102,.5);
}
input[type='submit'] {
	width: 10em;
	float:right;
	line-height: 2.8em;
	text-align: center;
	font-weight: bold;
	font-size:1.4em;
	overflow: visible;
	outline-color:rgba(153,153,153,.7);
	color:rgba(51,51,51,.5);
	transition: all 0.5s ease-out;
	border-radius: 5px;
	border: 1px solid #dce1e6;
	text-shadow: 1px 1px 1px #fff;
	box-shadow: 0 1px 2px #fff inset,0 -1px 0 #CCC inset;
	background: -webkit-linear-gradient(top,#F0F0F0,#D0D0D0);
	background: -moz-linear-gradient(top,#F0F0F0,#D0D0D0);
	background: linear-gradient(top,#F0F0F0,#D0D0D0);
}
input[type='submit']:hover {
	color:rgba(51,51,51,.8);
	box-shadow: 0 1px 2px #fff inset,0 -1px 0 #999 inset;
	transition: all 0.5s ease-in;
}
table tr td div {
	float:left;
	margin-top:1em
}